import { Breadcrumb, Col, List, Row } from 'antd';
import { useEffect, useState } from 'react';
import locationImg from '../../assets/location.png';
import { Link, useLocation } from 'react-router-dom';
import { Editor } from '@wangeditor/editor-for-react';
import './index.less';
import C from 'crypto-js';
import { selectOne } from '../../services/topic';
import moment from 'moment';
const ArticlePreview = (props: any) => {
  const location = useLocation();
  // editor 实例
  const [editor, setEditor] = useState(null); // JS 语法
  // 编辑器内容
  const [html, setHtml] = useState('');

  //
  // 编辑器配置
  const editorConfig = {
    readOnly: true,
  };

  //内容区域
  const bodyContent = () => {
    return (
      <>
        <div className="bodyContent_header">
          <div className="bodyContent_header_title">{props.title}</div>
        </div>
        <div className="bodyContent_time">
          发布时间: &nbsp; &nbsp;{props.time ? props.time :moment().format('YYYY-MM-DD HH:ss:mm')} &nbsp; &nbsp; &nbsp;
          &nbsp; &nbsp; &nbsp; 点击数量: &nbsp; &nbsp;{0}
        </div>
        <div className="bodyContent_body">
          <Editor
            defaultConfig={editorConfig}
            value={props.editHtml}
            onCreated={setEditor}
            style={{ height: '100%' }}
          />
        </div>
      </>
    );
  };

  return (
    <>
      <div className="newsContent">
        <Row>
          <Col span={24}>{bodyContent()}</Col>
        </Row>
      </div>
    </>
  );
};
export default ArticlePreview;
